<template>
	<view v-if="status">
		<image src="../../static/images/bg1.jpg" class="bg"></image>
		<view class="form_box">
			<view class="form_item flex_box">
				<view class="iconfont icon icon-user"></view>
				<input type="text" class="flex1 ipt" placeholder="请输入您的账号" v-model="userName">
				<view class="iconfont close icon-close" @tap="clearUser"></view>
			</view>
			<view class="form_item flex_box">
				<view class="iconfont icon icon-password"></view>
				<input type="password" class="flex1 ipt" placeholder="请输入密码" v-model="password">
				<view class="iconfont close icon-close" @tap="clearPass"></view>
			</view>
			<!-- <view class="save_pass flex_box" @tap="isSave=!isSave">
				<view class="iconfont" :class="isSave?'icon-CheckboxChecked-1':'icon-CheckboxUnchecked'"></view>
				<view>记住密码</view>
			</view> -->
		</view>
		<view class="btn" @tap="bind">立即绑定</view>
	</view>
</template>

<script>
	import {toast,getUrlParam} from '@/common/public.js'
	import {mixins} from '@/common/mixins.js'
	export default {
		mixins:[mixins],
		data() {
			return {
				isSave:true,
				userName:'',
				password:'',
				status:true,
				entry:1
			}
		},
		onLoad() {
			this.wxAuth()
		},
		methods: {
			bind() {
				if (this.userName=='') {
					toast('账号不能为空')
					return
				}
				if (this.password == '') {
					toast('密码不能为空')
					return
				}
				if(this.openID == '') {
					uni.showModal({
						title: '提示',
						content: '请先授权',
						success: (res) => {
							if (res.confirm) {
								this.wxjump(window.location.href)
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
					return
				}
				uni.showLoading({
				  title: '绑定中...'
				});
				let param = {
					appId:this.appId,
					code:this.code,
					password:this.password,
					userName:this.userName,
					wuserId:this.openID
				}
				this.$api.bindingAccountWithOpenID(param).then(res=>{
					if (res.code == 200) {
						uni.hideLoading()
						uni.setStorageSync('sgs_userId',this.openID)
						uni.redirectTo({
							url:'/pages/bindResult/bindResult'
						})
					} else {
						toast(res.msg)
						uni.hideLoading()
					}
				})
			},
			clearUser() {
				this.userName = ''
			},
			clearPass() {
				this.password = ''
			}
		}
	}
</script>

<style lang="stylus" scoped>
	.bg
		width 100%
		height 424rpx
	.form_box
		padding 130rpx 100rpx
		.form_item
			height 90rpx
			border 2rpx solid #f56c6c
			border-radius 10rpx
			padding 0 20rpx
			&:first-child
				margin-bottom 50rpx
			.icon
				font-size 32rpx
				color #999999
				margin-right 10rpx
			.ipt
				color #333
				font-size 28rpx
			.close
				font-size 32rpx
				color #f56c6c
	.save_pass
		font-size 28rpx
		color #666
		margin-top 30rpx
		.icon-CheckboxChecked-1
			color #f56c6c
	.btn
		width 550rpx
		height 96rpx
		line-height 96rpx
		margin 0 auto
		text-align center
		color #fff
		font-size 48rpx
		background-color #ff6600
</style>
